<%@ page language="java" contentType="text/html;charset=utf-8" %>
<!DOCTYPE html>
<!--[if IE 8]> <html lang="zh" class="ie8 no-js"> <![endif]-->
<!--[if IE 9]> <html lang="zh" class="ie9 no-js"> <![endif]-->
<!--[if !IE]><!-->
<html lang="en" class="no-js">
<!--<![endif]-->
<!-- BEGIN HEAD -->
<head>
    <jsp:include page="../common/common.jsp"/>
    <link href="${path}/assets/plugins/bootstrap-modal/css/bootstrap-modal-bs3patch.css" rel="stylesheet"
          type="text/css"/>
    <link href="${path}/assets/plugins/bootstrap-modal/css/bootstrap-modal.css" rel="stylesheet" type="text/css"/>
    <link href="${path}/assets/plugins/ligerUI/skins/Aqua/css/ligerui-all.css" rel="stylesheet" type="text/css"/>
    <link href="${path}/assets/plugins/ligerUI/skins/Gray/css/all.css" rel="stylesheet"/>
</head>
<body class="page-header-fixed page-sidebar-fixed">
<jsp:include page="../common/header.jsp"/>
<div class="clearfix"></div>
<div class="page-container">
    <div class="page-sidebar-wrapper">
        <jsp:include page="../common/menu.jsp"/>
    </div>
    <div class="page-content-wrapper">
        <div class="page-content">
            <div class="col-md-4">
                <div class="portlet yellow box">
                    <div class="portlet-title">
                        <div class="caption">
                            <i class="fa fa-group"></i> 角色
                        </div>
                        <div class="tools">
                            <a href="javascript:addRole()"><i class="fa fa-plus" title="添加"></i></a>
                        </div>
                    </div>
                    <div class="portlet-body">
                        <div class="scroller" style="height:500px" data-always-visible="1" data-rail-visible="0">
                            <div id="sysRole" class="list-group"></div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-md-8">
                <div class="portlet box purple tabbable">
                    <div class="portlet-title">
                        <div class="caption">
                            <i class="fa fa-reorder"></i> 详细信息
                        </div>
                    </div>
                    <div class="portlet-body">
                        <div class="portlet-tabs">
                            <ul class="nav nav-tabs" id="roleTab">
                                <li><a href="#menuInfo" data-toggle="tab">菜单权限</a></li>
                                <li class="active"><a href="#userInfo" data-toggle="tab">用户信息</a></li>
                            </ul>
                            <div class="tab-content">
                                <div class="tab-pane active" id="userInfo">
                                    <div class="scroller" style="height:500px" data-always-visible="1"
                                         data-rail-visible="0">
                                        <form id="formUser" class="form-horizontal">
                                            <div class="form-group">
                                                <div class="col-md-12">
                                                    <button type="button" class="btn green" onclick="addUser()">添加用户
                                                    </button>
                                                    <button type="button" class="btn red" onclick="delUsers()">删除所选用户
                                                    </button>
                                                </div>
                                            </div>
                                        </form>
                                        <table class="table table-striped table-bordered table-hover"
                                               id="dataList"></table>
                                    </div>
                                </div>
                                <div class="tab-pane" id="menuInfo">
                                    <div class="scroller" style="height:500px" data-always-visible="1"
                                         data-rail-visible="0">
                                        <form id="menuPriv_form1" method="post" style="height: 100%; ">
                                            <input type="hidden" id="Type" value="R">
                                            <input type="hidden" id="roleId" name="roleId">
                                            <table width="100%" border="0" cellspacing="0" cellpadding="0" height="100%"
                                                   class="js_layoutTable">
                                                <tbody>
                                                <tr id="menuPriv_trToolbar">
                                                    <td height="33">
                                                        <button type="button" class="btn yellow"
                                                                onclick="onSelectAllClick()">全选
                                                        </button>
                                                        <button type="button" class="btn blue" onclick="saveMenu()">保存
                                                        </button>
                                                    </td>
                                                </tr>
                                                <tr valign="top">
                                                    <td style="padding-top: 7px; padding-right: 7px; padding-bottom: 7px; padding-left: 7px; height:98%; zoom: 1;">
                                                        <div id="menugrid"></div>
                                                    </td>
                                                </tr>
                                                </tbody>
                                            </table>
                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div id="baseInfo" class="modal fade in" tabindex="-1">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
                    <h4 class="modal-title">添加角色</h4>
                </div>
                <div class="modal-body">
                    <form id="formBase" class="form-horizontal">
                        <div class="form-group">
                            <label class="col-md-3 control-label">角色名称：</label>

                            <div class="col-md-6">
                                <input type="hidden" name="id" id="id">
                                <input type="text" id="rolename" name="rolename" class="form-control"/>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 control-label">可用标识：</label>

                            <div class="col-md-6 radio-list">
                                <table>
                                    <tr>
                                        <td><label class="radio-inline"><input type="radio" name="isactive" value="0"/></label>
                                        </td>
                                        <td>无效</td>
                                        <td><label class="radio-inline"><input type="radio" name="isactive" value="1"/></label>
                                        </td>
                                        <td>有效</td>
                                    </tr>
                                </table>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 control-label">角色描述：</label>

                            <div class="col-md-6">
                                <input type="text" id="roledesc" name="roledesc" class="form-control"/>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn default" data-dismiss="modal">取消</button>
                    <button type="button" class="btn red" onclick="delRole()" id="btnDel">删除</button>
                    <button type="button" class="btn blue" onclick="saveRole()">保存</button>
                </div>
            </div>
            <div id="modal_addUser" class="modal container fade" tabindex="-1">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
                    <h4 class="modal-title">添加用户</h4>
                </div>
                <div class="modal-body">
                    <table class="table table-striped table-bordered table-hover" id="addUserList"></table>
                </div>
            </div>
        </div>
    </div>
</div>
<jsp:include page="../common/footer.jsp"/>
<script src="${path}/assets/plugins/ligerUI/js/core/base.js" type="text/javascript"></script>
<script src="${path}/assets/plugins/ligerUI/js/plugins/ligerGrid.js" type="text/javascript"></script>
<script src="${path}/assets/plugins/ligerUI/js/plugins/ligerResizable.js" type="text/javascript"></script>
<script src="${path}/assets/plugins/ligerUI/js/plugins/ligerDrag.js"></script>
<script src="${path}/assets/plugins/ligerUI/js/plugins/ligerDialog.js"></script>
<script src="${path}/assets/plugins/ligerUI/js/plugins/ligerTree.js"></script>
<script type="text/javascript" src="${path}/platform/js/role.js"></script>
</body>
<!-- END BODY -->
</html>